import {View, Text, Button} from 'react-native';

export default function App() {
  return (
    <View>
      <Text>=======</Text>
      <Child
        header={<Button title="父亲的按钮1" />}
        content={<Text style={{color: 'red'}}>内容</Text>}
        footer={<Text style={{color: 'blue'}}>底部</Text>}
      />
      <Text>=======</Text>
    </View>
  );
}

// 子组件
function Child({
  header,
  content,
  footer,
}: {
  header: React.ReactNode;
  content: React.ReactNode;
  footer: React.ReactNode;
}) {
  return (
    <View>
      {/* 头部 */}
      <View>
        <Text>头部---</Text>
        {header}
        <Text>头部---</Text>
      </View>
      {/* 内容 */}
      <View>
        <Text>内容+++</Text>
        {content}
        <Text>内容+++</Text>
      </View>
      {/* 底部 */}
      <View>
        <Text>底部***</Text>
        {footer}
        <Text>底部***</Text>
      </View>
    </View>
  );
}
